.swiper-container {
    background-color: #c61a10;
}
.tu1 {
    
}
.logo {
    position: absolute;
    top: 27rem/@baseFontSize;
    left: 30rem/@baseFontSize;
    width: 137rem/@baseFontSize;
}
.lamp_r {
    position: absolute;
    top: 0;
    right: 0;
    width: 242rem/@baseFontSize;
}
.lamp_l {
    position: absolute;
    top: 160rem/@baseFontSize;
    left: 0;
    width: 133rem/@baseFontSize;
}
.lamp {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.lion_head {
    width: 100%;
    position: absolute;
    top: 78rem/@baseFontSize;
    left: 0;
}
.riddle {
    width: 100%;
    position: absolute;
    top: 375rem/@baseFontSize;
    left: 0;
    .riddle_content {
        width: 100%;
        height: 0rem/@baseFontSize;
        // height: 474rem/@baseFontSize;
        background: url(../images/riddle_content.png) no-repeat top center / 640rem/@baseFontSize 474rem/@baseFontSize;
        overflow: hidden;
        .wz_title {
            font-size: 52rem/@baseFontSize;
            line-height: 1.2;
            padding-top: 90rem/@baseFontSize;
            padding-left: 205rem/@baseFontSize;
        }
        .wz_content {
            font-size: 42rem/@baseFontSize;
            line-height: 1.8;
            padding-top: 10rem/@baseFontSize;
            ul {
                li {
                    padding-left: 262rem/@baseFontSize;
                }
            }
        }
    }
    .riddle_bottom {
        width: 100%;
    }
}

.start,.next {
    position: absolute;
    top: 800rem/@baseFontSize;
    right: 10rem/@baseFontSize;
    width: 324rem/@baseFontSize;
    animation: big_small 1s linear infinite alternate;
}

ul{
    margin: 0;
    padding: 0;
}
.screen1 {
    .riddle_content {
        .wz_title {
            font-size: 68rem/@baseFontSize;
            line-height: 1.2;
            padding-top: 96rem/@baseFontSize;
            padding-left: 205rem/@baseFontSize;
        }
        .wz_content {
            font-size: 42rem/@baseFontSize;
            line-height: 1.2;
            padding-top: 50rem/@baseFontSize;
            padding-left: 205rem/@baseFontSize;
        }
    }
}


@keyframes riddle_ani {
    0% {
        height: 0rem/@baseFontSize;
    }

    100% {
        height: 474rem/@baseFontSize;
    }
}

.riddle_ani {
    animation-name: riddle_ani;
}

@keyframes big_small {
    0% {
        transform: scale(0.9);
    }

    100% {
        transform: scale(1);
    }
}


.screen10 {
    .tu2 {
        position: absolute;
        top: 100rem/@baseFontSize;
        left: 0;
        width: 264rem/@baseFontSize;
    }
    .tu3 {
        position: absolute;
        top: 310rem/@baseFontSize;
        right: 0;
        width: 163rem/@baseFontSize;
    }
    .success {
        display: none;
        .lion {
            position: absolute;
            top: 25rem/@baseFontSize;
            right: 120rem/@baseFontSize;
            width: 265rem/@baseFontSize;
        }
        .msg {
            position: absolute;
            top: 370rem/@baseFontSize;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 34rem/@baseFontSize;
            line-height: 1.3;
        }
        .user_info {
            position: absolute;
            top:500rem/@baseFontSize;
            left: 0;
            width: 100%;
            ul {
                li {
                    height: 54rem/@baseFontSize;
                    line-height: 54rem/@baseFontSize;
                    background: url(../images/success_input.jpg) no-repeat top center / 422rem/@baseFontSize 54rem/@baseFontSize;
                    margin-bottom: 30rem/@baseFontSize;
                    padding-left: 200rem/@baseFontSize;
                    font-size: 24rem/@baseFontSize;
                    input {
                        margin: 0;
                        padding: 0;
                        width: 220rem/@baseFontSize;
                        height: 54rem/@baseFontSize;
                        line-height: 54rem/@baseFontSize;
                        background: transparent;
                    }
                }
            }
            .submit {
                text-align: center;
                span {
                    display: inline-block;
                    width: 150rem/@baseFontSize;
                    height: 54rem/@baseFontSize;
                    border-radius: 10rem/@baseFontSize;
                    line-height: 54rem/@baseFontSize;
                    text-align: center;
                    background-color: #ff9f34;
                }
            }
        }
    }
    .error {
        display: none;
        .lion {
            position: absolute;
            top: 300rem/@baseFontSize;
            left: 125rem/@baseFontSize;
            width: 261rem/@baseFontSize;
        }
        .msg {
            position: absolute;
            top: 560rem/@baseFontSize;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 34rem/@baseFontSize;
            line-height: 1.3;
        }
        .xuan {
            position: absolute;
            top: 670rem/@baseFontSize;
            left: 0;
            width: 100%;
            text-align: center;
            img {
                display: inline-block;
                margin: 0 10rem/@baseFontSize;
            }
            .again {
                width: 194rem/@baseFontSize;
            }
            .invitation {
                width: 289rem/@baseFontSize;
            }
        }
    }
    .fenxiang {
        display: none;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, .7);
    }
}


/*音乐*/

#music {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.music_btn {
    width: 30px;
    height: 30px;
    position: fixed;
    top: 2%;
    right: 2%;
    z-index: 99999;
    opacity: 0.5;
}

.music_btn img {
    width: 100%;
    height: 100%;
}

.music_on s {
    display: block;
    width: 9px;
    height: 13px;
    background: url(../images/icon_music.png) no-repeat scroll top left;
    background-size: 100% 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.music_on s:nth-child(1) {
    -webkit-animation: music1 2s infinite;
    animation: music1 2s infinite;
}

.music_on s:nth-child(2) {
    transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -webkit-animation: music2 2s 1s infinite;
    animation: music2 2s 0.5s infinite;
}

.music_on s:nth-child(3) {
    transform: rotate(50deg);
    -webkit-transform: rotate(50deg);
    -webkit-animation: music3 2s 1.5s infinite;
    animation: music3 2s 1.5s infinite;
}

@-webkit-keyframes music1 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -15px;
        left: -15px;
        opacity: 0;
    }
}

@keyframes music1 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -15px;
        left: -15px;
        opacity: 0;
    }
}

@-webkit-keyframes music2 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -20px;
        left: -8px;
        opacity: 0;
    }
}

@keyframes music2 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -20px;
        left: -8px;
        opacity: 0;
    }
}

@-webkit-keyframes music3 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -30px;
        left: 2px;
        opacity: 0;
    }
}

@keyframes music3 {
    0% {
        top: 0;
        left: 0;
        opacity: 0;
    }
    80% {
        opacity: 1;
    }
    100% {
        top: -30px;
        left: 2px;
        opacity: 0;
    }
}


/*------------------------------*/